<template>
  <div>
      <template>
         <Tabs  @on-click="handleTab"> 
            <TabPane label="价格管理"  name="PriceTotal"></TabPane>
            <!--
            <TabPane label="红枣品种"  name="TypeTotal"></TabPane>
            <TabPane label="红枣等级"  name="ClassTotal"></TabPane>
            -->
            <TabPane label="装箱类型"  name="PackTotal"></TabPane>
            <TabPane label="卸货地点"  name="LandingTotal"></TabPane>
        </Tabs>
      <component :is="currentTab" keep-alive></component>
    </template>
  </div>
</template>

<script>
import PriceTotal from "./price_info.vue";
import TypeTotal from "./type_info.vue";
import ClassTotal from "./class_info.vue";
import LandingTotal from "./landing_info.vue";
import PackTotal from "./pack_info.vue";
export default {
  name: "tables_page",
  components: {
   PriceTotal,
   TypeTotal,
   ClassTotal,
   LandingTotal,
   PackTotal
  }, 
  data() {
    return {
       currentTab: 'PriceTotal' // currentTab 用于标识当前触发的子组件
    }
    
  },
  methods: {
    handleTab:function(name){
     this.currentTab = name
    },
  
  },
   
};
</script>

